<template>
    <div>
        <h3>说明:自定义ref,自定义拦截函数get，set</h3>
        {{ foo_proxy }}
    </div>
    <el-button @click="handleCount">+</el-button>
</template>

<script setup>
import { customRef } from "vue"

let foo = 1
const foo_proxy = customRef(function (trackRefValue, triggerRefValue) {
    const get = () => {
        trackRefValue()
        return foo
    }
    const set = (newVal) => {
        foo = newVal
        triggerRefValue()
        return true
    }
    return {
        get,
        set
    }
})
const handleCount = () => {
    foo_proxy.value += 1
}
</script>

<style lang="scss" scoped>
</style>